<style>
    .dialog .dialogContent{
        overflow-y: auto;
        overflow-x: hidden;
    }
    table th{
        font-weight: bold;
        border-style: solid;
        border-color: #dfe4e8;
        background-color: #fafcfc;
    }
    .grid .gridScroller{
        overflow-x: hidden;
        overflow-y: auto;
    }
</style>
<div class="pageContent" style="overflow-y: hidden;overflow-x: auto;">
        <img src="${rc.getContextPath()}/manage/workflow/resource/process-instance?pid=${processInstanceId!''}&type=image"/>        
        <div id="processImageBorder">
            <#if nodeDto??>
                <#list nodeDto as node>
                    <#if node.type=="USERTASK">
                    <#assign historys = node.history/>
                    <#if historys?size gt 0 >
                        <div id="${node.id!''}" style="display: none;">
                            <table class="table" width="430px">
                                <thead><tr><th width="60"><@label key="flowHandleUser.C">处理人</@label></th><th width="140"><@label key="result.C">结果</@label></th><th width="140"><@label key="flowHandleTime.C">处理时间</@label></th><th width="60"><@label key="useTime.C">耗时</@label></th></tr></thead>
                                <tbody>
                                <#list historys as hostory>    
                                    <tr><td>${hostory.userText!''}</td><td>${hostory.result!''}</td><td>${(hostory.checkTime?string('yyyy-MM-dd HH:mm:ss'))?if_exists}</td><td>${hostory.useTime!''}</td></tr>                
                                </#list>
                                </tbody>
                            </table>
                        </div>
                        <#else>
                        <div id="${node.id!''}" style="display: none;">
                            <table class="table" width="430px">
                                <thead><tr><th width="100"><@label key="flowNodeName.C">节点名称</@label></th><th width="100"><@label key="flowHandleUser.C">处理人</@label></th><th width="100"><@label key="flowHandleRole.C">处理角色</@label></th><th width="100"><@label key="flowHandleOrg.C">处理组织</@label></th></tr></thead>
                                <tbody>
                                        <tr><td>${node.name!''}</td><td>${node.assigneeName!''}</td><td>${node.roles!''}</td><td>${node.groups!''}</td></tr>
                                </tbody>
                            </table>
                        </div>
                    </#if>
                    </#if>
                    <div class="activity-attr" style="position:absolute;left:${node.x}px;top:${node.y}px;width:${node.width}px;height:${node.height}px;z-index:14999;
                     background-color: black;opacity: 0;" activitid="${node.id!''}">
                    </div>
                </#list>
            </#if>
        </div>
        <div class="tabs">
        <div class="tabsHeader">
            <div class="tabsHeaderContent">
                <ul>
                    <li id="component" data-selectedid="process_hostory"
                        class="exerInputS"><a href="javascript:;" id="select1"><span><@label key="workflowHistory.C">流程记录</@label></span></a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="tabsContent">
        <div>
            <table class="table" width="90%" >
                <thead>
                    <tr>
                        <th width="80"><@label key="flowTaskName.C">任务名称</@label></th>
                        <th width="80"><@label key="flowHandleUser.C">流程处理人</@label></th>
                        <th width="100"><@label key="flowHandleTime.C">处理时间</@label></th>
                        <th width="100"><@label key="useTime.C">耗时</@label></th>
                        <th width="150"><@label key="handleResult.C">结果</@label></th>
                        <th width="100"><@label key="suggestion.C">意见</@label></th>
                    </tr>
                </thead>
                <tbody>
                    <#if workFlowHistorys??> <#list workFlowHistorys as history>
                    <tr>
                        <td>${history.taskName!''}</td>
                        <td>${history.userText!''}</td>
                        <td>${(history.checkTime?string("yyyy-MM-dd HH:mm:ss"))?if_exists}</td>
                        <td>${history.useTime!''}</td>
                        <td>${history.result!''}</td>
                        <td>${history.suggestion!''}</td>
                    </tr>
                    </#list> <#else>
                    <tr>
                        <td colspan="11" class="noData">======<@label key='noListData.C'>列表无数据</@label>=====</font>
                        </td>
                    </tr>
                    </#if>
                </tbody>
            </table>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(function(){
          $('div.activity-attr').qtip({
              content: {
                  title: "节点信息",
                  text: function() {
                      var activityId = $(this).attr("activitid");
                      var activityIdDIV = $("div#"+activityId);
                      return $(activityIdDIV).html();
                  }
              },
              position: {
                  at: 'bottom left',
                  adjust: {
                      x: 3
                  }
              },
              style: {
                  classes: 'qtip-dwz qtip-shadow'
              }
          });
        
    })
</script>